<br />

<p class='text-center lead'>{title}</p>

<script language="JavaScript" type="text/javascript" src='http://<?php echo base_url(); ?>assets/JS/jquery.tablesorter.js'></script>

<br>

<form class="form-horizontal" role="form">
	<div class="form-group">
		<div class="col-md-1">
			<input type = "text"  class="form-control" name = "contact_by" id = "contact_by" />
		</div>
		<div class="col-md-1">
			<input type = "text"  class="form-control" name = "country" id = "country" />
		</div>
		<div class="col-md-2">
			<input type = "text"  class="form-control" name = "name" id = "name" />
		</div>
		<div class="col-md-2 type_a">
			<input type = "text"  class="form-control" name = "website" id = "website" />
		</div>
		<div class="col-md-1 type_a">
			<input type = "text"  class="form-control" name = "type" id = "type" />
		</div>
		<div class="col-md-3 type_b">
			<input type = "text"  class="form-control" name = "scope" id = "scope" />
		</div>
		<div class="col-md-2 type_b">
			<input type = "text"  class="form-control" name = "address" id = "address" />
		</div>
		<div class="col-md-1 type_b">
			<input type = "text"  class="form-control" name = "remark" id = "remark" />
		</div>
		<div class="col-md-1 type_a">
			<input type = "text"  class="form-control" name = "sector" id = "sector" />
		</div>
		<div class="col-md-2 type_a">
			<input type = "text"  class="form-control" name = "status" id = "status" />
		</div>
		<div class="col-md-2">
			<a class='btn btn-warning btn-sm' id="clear" role='button'>清空</a> 
			<a class='btn btn-info btn-sm' id="pre" role='button'>一</a> 
			<a class='btn btn-info btn-sm' id="aft" role='button'>二</a> 
			<a class='btn btn-success btn-sm'  href='http://<?php echo base_url("index.php/client/export_csv"); ?>' role='button'>导出</a>
		</div>
		
	</div>
	
	
</form>


<table class='table table-striped table-bordered' id = 'mytable'>
	<thead>
	<tr  class="info">
	<th class="col-md-1" ><strong>负责人</strong></th>
	<th class="col-md-1" ><strong>国家</strong></th>
	<th class="col-md-2" ><strong>客户名</strong></th>
	<th class="col-md-2 type_a" ><strong>网址</strong></th>
	<th class="col-md-1 type_a" ><strong>客户类别</strong></th>
	<th class="col-md-3 type_b"><strong>业务范围</strong></th>
	<th class="col-md-2 type_b" ><strong>地址</strong></th>
	<th class="col-md-1 type_b" ><strong>备注</strong></th>
	<th class="col-md-1 type_a" ><strong>行业</strong></th>
	<th class="col-md-2 type_a"><strong>最近两次联系</strong></th>
	<th class="col-md-2" ><strong >操作</strong></th>
	</tr>
	</thead>
	
	<tbody>
	{clients}
		<tr>
		<td>{contact_by}</td>
		<td>{country}</td>
		<td>{name}</td>
		<td class="type_a" ><a href='http://{website}' target='_blank' >{website}</a></td>
		<td class="type_a" >{type}</td>
		<td class="type_b" >{scope}</td>
		<td class="type_b" >{address}</td>
		<td class="type_b" >{remark}</td>
		<td class="type_a" >{sector}</td>
		<td class="type_a" ><p>{cd1}&nbsp{status1}</p> <p>{cd2}&nbsp{status2}</p></td>
		<td>
			<a class='btn btn-warning btn-sm' href='http://<?php echo base_url(); ?>index.php/client/edit/{id}' role='button'>改</a>
			<a class='btn btn-info btn-sm' href='http://<?php echo base_url(); ?>index.php/contact_person/index/{id}' role='button' target = '_blank'>联系人</a>
			<a class='btn btn-info btn-sm' href='http://<?php echo base_url(); ?>index.php/contact_record/index/{id}' role='button' target = '_blank'>记录</a>
		</td>
		</tr>
	{/clients}
	</tbody>
</table>

<script type="text/javascript" src="http://<?php echo base_url(); ?>assets/JS/jquery.tablesorter.js"></script>
<script type = "text/javascript">
jQuery(function() {
		jQuery(".type_b").hide();
		jQuery("#pre").click(function(){
			jQuery(".type_a").show();
			jQuery(".type_b").hide();
		});
		jQuery("#aft").click(function(){
			jQuery(".type_b").show();
			jQuery(".type_a").hide();
		});
		
		//过滤器部分
		//清空inputs
		jQuery("#clear").click(function(){
			jQuery("table tbody tr").removeClass("hidden");
			jQuery("input").val("");
		});
		
		jQuery("#contact_by").blur(function(){
			var x = jQuery("#contact_by").val();
			jQuery("table tbody tr:not(.hidden)")
				.addClass("hidden")
				.find('td:eq(0)')
				.filter(":contains('"+ x +"')")
				.parent()
				.removeClass("hidden");
		});
		
		jQuery("#country").blur(function(){
			var x = jQuery("#country").val();
			jQuery("table tbody tr:not(.hidden)")
				.addClass("hidden")
				.find('td:eq(1)')
				.filter(":contains('"+ x +"')")
				.parent()
				.removeClass("hidden");
		});
		
		jQuery("#name").blur(function(){
			var x = jQuery("#name").val();
			jQuery("table tbody tr:not(.hidden)")
				.addClass("hidden")
				.find('td:eq(2)')
				.filter(":contains('"+ x +"')")
				.parent()
				.removeClass("hidden");
		});
		
		jQuery("#website").blur(function(){
			var x = jQuery("#website").val();
			jQuery("table tbody tr:not(.hidden)")
				.addClass("hidden")
				.find('td:eq(3)')
				.filter(":contains('"+ x +"')")
				.parent()
				.removeClass("hidden");
		});
		
		jQuery("#type").blur(function(){
			var x = jQuery("#type").val();
			jQuery("table tbody tr:not(.hidden)")
				.addClass("hidden")
				.find('td:eq(4)')
				.filter(":contains('"+ x +"')")
				.parent()
				.removeClass("hidden");
		});
		
		jQuery("#scope").blur(function(){
			var x = jQuery("#scope").val();
			jQuery("table tbody tr:not(.hidden)")
				.addClass("hidden")
				.find('td:eq(5)')
				.filter(":contains('"+ x +"')")
				.parent()
				.removeClass("hidden");
		});
		
		jQuery("#address").blur(function(){
			var x = jQuery("#address").val();
			jQuery("table tbody tr:not(.hidden)")
				.addClass("hidden")
				.find('td:eq(6)')
				.filter(":contains('"+ x +"')")
				.parent()
				.removeClass("hidden");
		});
		
		jQuery("#remark").blur(function(){
			var x = jQuery("#remark").val();
			jQuery("table tbody tr:not(.hidden)")
				.addClass("hidden")
				.find('td:eq(7)')
				.filter(":contains('"+ x +"')")
				.parent()
				.removeClass("hidden");
		});
		
		jQuery("#sector").blur(function(){
			var x = jQuery("#sector").val();
			jQuery("table tbody tr:not(.hidden)")
				.addClass("hidden")
				.find('td:eq(8)')
				.filter(":contains('"+ x +"')")
				.parent()
				.removeClass("hidden");
		});
		
		jQuery("#status").blur(function(){
			var x = jQuery("#status").val();
			jQuery("table tbody tr:not(.hidden)")
				.addClass("hidden")
				.find('td:eq(9)')
				.filter(":contains('"+ x +"')")
				.parent()
				.removeClass("hidden");
		});
		
		
		
});

</script>





<script type = "text/javascript">
	jQuery(function() {
		jQuery("#filterName").keyup(function(){
			jQuery("table tbody tr")
				.hide()
				.filter(":contains('"+(jQuery(this).val() )+"')")
				.show();
		}).keyup();
	});

</script>

<script type="text/javascript">
	jQuery("#mytable").tablesorter();
</script>
